import MarkdownParser from '../../utils/MarkdownParser';
import React from 'react';
import MyMarkdownParser from '../../utils/MyMarkdownParser';
interface Message {
  role: 'user' | 'assistant';
  content: string;
}

interface MessageProps {
  messages: Message[];
}

const Message: React.FC<MessageProps> = ({ messages }) => {
  return (
    <div className="space-y-4">
      {messages.map((message, index) => (
        <div
          key={index}
          className={`p-4 rounded-lg ${
            message.role === 'user'
              ? 'bg-blue-100 ml-auto max-w-[80%]'
              : 'bg-gray-100 max-w-[80%]'
          }`}
        >
          <div className="whitespace-pre-wrap">
            {message.role === 'user' ? (
              message.content
            ) : (
              // <MarkdownParser markdown={message.content} />
              <MyMarkdownParser markdown={message.content} />
            )}
          </div>
        </div>
      ))}
    </div>
  );
};

export default Message;